<template>
    <div>
        <div class="hearder">
            <div class="le">货物申报表头</div>
            <div @click="state.hearderHidden1 = !state.hearderHidden1" class="ri">{{ state.hearderHidden1 ? '收起' : '展开' }}
            </div>
        </div>
        <el-collapse-transition>
            <div v-if="state.hearderHidden1">
                <div style="border: 0;margin-top: 8px;" class="form-container">
                    <el-form :inline="true" label-width="100px" :size="'small'" ref="form">
                        <el-row>
                            <el-col :span="6">
                                <el-form-item label="申报地海关">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                        <el-option label="批准文号" :value="4" />
                                        <el-option label="物流单号" :value="5" />
                                        <el-option label="发货单号" :value="6" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="申报状态">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="统一编号">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="预录入编号">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="海关编号">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="进境关别">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="备案号">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="合同协议号">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="运输方式">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="运输工具名称">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="航次">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="提运单号">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="件数">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="包装种类">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="毛重（KG）">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="净重（KG）">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="许可证号">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="运抵国">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="中转港">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="成交方式">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="出境口岸">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="货物存放地点">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="指运港/经停港">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="报关单类型">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="出口日期">
                                    <el-date-picker v-model="recDateTime" type="daterange" range-separator="~"
                                        start-placeholder="开始日期" end-placeholder="结束日期" size="small" style="width: 100%"
                                        clearable value-format="YYYY-MM-DD" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="申报日期">
                                    <el-date-picker v-model="recDateTime" type="daterange" range-separator="~"
                                        start-placeholder="开始日期" end-placeholder="结束日期" size="small" style="width: 100%"
                                        clearable value-format="YYYY-MM-DD" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="批准文号">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="监管方式">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="贸易国别">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="箱型箱量">
                                    <el-input disabled clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="随附单证">
                                    <el-input disabled clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="6">
                                <el-form-item label="征免性质">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="24">
                                <el-form-item label="境内收货人">
                                    <div style="width: 100%;display: flex;justify-content: space-between;">
                                        <el-input clearable placeholder="请输入录入18位社会信用代码/NO " style="width: 24%" />
                                        <el-input clearable placeholder="请输入10位海关代码" style="width: 24%" />
                                        <el-input clearable placeholder="请输入10位检验检疫编码" style="width: 24%" />
                                        <el-input clearable placeholder="请输入企业名称（中文）" style="width: 24%" />
                                    </div>
                                </el-form-item>
                            </el-col>
                            <el-col :span="24">
                                <el-form-item label="境外收货人">
                                    <div style="width: 100%;display: flex;justify-content: space-between;">
                                        <el-input clearable placeholder="请输入境外收发货人代码 " style="width: 49%" />
                                        <el-input clearable placeholder="请输入企业名称（外文）" style="width: 49%" />
                                    </div>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="运费">
                                    <div style="width: 100%;display: flex;justify-content: space-between;">
                                        <el-input clearable placeholder="运费标识可录入 " style="width: 33%" />
                                        <el-input clearable placeholder="运费／率可录入 " style="width: 33%" />
                                        <el-select placeholder="运费币制" style="width: 33%" clearable filterable>
                                            <el-option label="主提单号" :value="1" />
                                            <el-option label="报关提单号" :value="2" />
                                            <el-option label="报关单号" :value="3" />
                                        </el-select>
                                    </div>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="保险费">
                                    <div style="width: 100%;display: flex;justify-content: space-between;">
                                        <el-input clearable placeholder="保险费标记 " style="width: 33%" />
                                        <el-input clearable placeholder="保险费／率 " style="width: 33%" />
                                        <el-select placeholder="保险费币制" style="width: 33%" clearable filterable>
                                            <el-option label="主提单号" :value="1" />
                                            <el-option label="报关提单号" :value="2" />
                                            <el-option label="报关单号" :value="3" />
                                        </el-select>
                                    </div>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="杂费">
                                    <div style="width: 100%;display: flex;justify-content: space-between;">
                                        <el-input clearable placeholder="杂费标识" style="width: 33%" />
                                        <el-input clearable placeholder="杂费标识" style="width: 33%" />
                                        <el-select placeholder="杂费币制" style="width: 33%" clearable filterable>
                                            <el-option label="主提单号" :value="1" />
                                            <el-option label="报关提单号" :value="2" />
                                            <el-option label="报关单号" :value="3" />
                                        </el-select>
                                    </div>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="备注">
                                    <el-input clearable placeholder="备注 弹出弹窗进行编辑或查看" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="标记唛码">
                                    <el-input clearable placeholder="N/M" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="标记唛码">
                                    <el-select placeholder="保险费币制" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-form>
                </div>
            </div>
        </el-collapse-transition>
        <div class="hearder">
            <div class="le">涉检基本信息</div>
            <div @click="state.hearderHidden2 = !state.hearderHidden2" class="ri">{{ state.hearderHidden2 ? '收起' : '展开' }}
            </div>
        </div>
        <el-collapse-transition>
            <div v-if="state.hearderHidden2">
                <div style="border: 0;margin-top: 8px;" class="form-container">
                    <el-form :inline="true" label-width="120px" :size="'small'" ref="form">
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="检验检疫受理机关">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                        <el-option label="批准文号" :value="4" />
                                        <el-option label="物流单号" :value="5" />
                                        <el-option label="发货单号" :value="6" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="企业资质">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="口岸检验检疫机关">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                        <el-option label="批准文号" :value="4" />
                                        <el-option label="物流单号" :value="5" />
                                        <el-option label="发货单号" :value="6" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="启运日期">
                                    <el-input clearable placeholder="请输入" style="width: 100%" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="目的地检验检疫机关">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                        <el-option label="批准文号" :value="4" />
                                        <el-option label="物流单号" :value="5" />
                                        <el-option label="发货单号" :value="6" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="关联号码及理由">
                                    <div style="display: flex;width: 100%;justify-content: space-between;">
                                        <el-input clearable placeholder="请输入" style="width: 49%" />
                                        <el-select placeholder="请选择" style="width: 49%" clearable filterable>
                                            <el-option label="主提单号" :value="1" />
                                            <el-option label="报关提单号" :value="2" />
                                            <el-option label="报关单号" :value="3" />
                                            <el-option label="批准文号" :value="4" />
                                            <el-option label="物流单号" :value="5" />
                                            <el-option label="发货单号" :value="6" />
                                        </el-select>
                                    </div>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="特殊业务及标识">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                        <el-option label="批准文号" :value="4" />
                                        <el-option label="物流单号" :value="5" />
                                        <el-option label="发货单号" :value="6" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="所需单证">
                                    <el-select placeholder="请选择" style="width: 100%" clearable filterable>
                                        <el-option label="主提单号" :value="1" />
                                        <el-option label="报关提单号" :value="2" />
                                        <el-option label="报关单号" :value="3" />
                                        <el-option label="批准文号" :value="4" />
                                        <el-option label="物流单号" :value="5" />
                                        <el-option label="发货单号" :value="6" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-form>
                </div>
            </div>
        </el-collapse-transition>
        <div class="hearder">
            <div class="le">货物申报表体</div>
            <div @click="state.hearderHidden3 = !state.hearderHidden3" class="ri">{{ state.hearderHidden3 ? '收起' : '展开' }}
            </div>
        </div>
        <el-collapse-transition>
            <div v-if="state.hearderHidden3">
                <el-tabs class="demo-tabs" @tab-click="handleClick">
                    <el-tab-pane label="商品清单">
                        <el-table :data="state.commodityList" border style="width: 100%">
                            <el-table-column sortable type="index" label="箱号" />
                            <el-table-column sortable prop="recordSerial" label="备案序号" />
                            <el-table-column sortable prop="productID" label="商品编号" />
                            <el-table-column sortable prop="classificationMark" label="归类标志" />
                            <el-table-column sortable prop="productName" label="商品名称" />
                            <el-table-column sortable prop="productEngName" label="商品英文名称" />
                            <el-table-column sortable prop="commercialSpecification" label="商品规格/型号" />
                            <el-table-column sortable prop="version" label="版本号" />
                            <el-table-column sortable prop="originRegion" label="原产地区" />
                            <el-table-column sortable prop="productionUnit" label="生产单位名称" />
                            <el-table-column width="80" fixed="right" sortable label="操作">
                                <template #default="{ row }">
                                    <span style="color: #3B78FF;cursor: pointer;">详情</span>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-tab-pane>
                    <el-tab-pane label="集装箱信息">
                        <el-table :data="state.containerInfo" border style="width: 100%">
                            <el-table-column sortable type="index" label="箱号" />
                            <el-table-column sortable prop="boxPile" label="箱型" />
                            <el-table-column sortable prop="deadLoad" label="自重（KG）" />
                            <el-table-column sortable prop="LCLMarking" label="拼箱标识" />
                            <el-table-column sortable prop="ContainerWeight" label="箱货重量" />
                            <el-table-column sortable prop="ItemNumber" label="商品项号/型号" />
                        </el-table>
                    </el-tab-pane>
                    <el-tab-pane label="随附单据">
                        <el-button type="primary">新增</el-button>
                        <el-button type="primary">删除</el-button>
                        <el-table :data="state.receipts" border style="width: 100%;margin-top: 8px;">
                            <el-table-column type="selection" width="55" />
                            <el-table-column width="200" sortable prop="code" label="单证代码" />
                            <el-table-column sortable prop="number" label="单证编号" />
                            <el-table-column width="200" sortable prop="name" label="附件名称">
                                <template #default="{ row }">
                                    <span style="color: #3B78FF;cursor: pointer;">{{ row.name }}</span>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-tab-pane>
                    <el-tab-pane label="其他">
                        <div style="border: 0;margin-top: 8px;" class="form-container">
                            <el-form :inline="true" label-width="120px" :size="'small'" ref="form">
                                <el-row>
                                    <el-col :span="12">
                                        <el-form-item label="关联报关单">
                                            <el-input clearable placeholder="请输入" style="width: 100%" />
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="关联备案">
                                            <el-input clearable placeholder="请输入" style="width: 100%" />
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="保税/监管场地">
                                            <el-input clearable placeholder="请输入" style="width: 100%" />
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="场地代码">
                                            <el-input clearable placeholder="请输入" style="width: 100%" />
                                        </el-form-item>
                                    </el-col>
                                </el-row>
                            </el-form>
                        </div>
                        <div
                            style="border-radius: 2px;background: #FEF3E8;border: 1px solid #FFD1A0;display:flex;padding: 4px 16px;">
                            <div style="margin-right: 10px;">总价：{{ 4000 }}</div>
                            <div style="margin-right: 10px;">成交数量总和：{{ 4000 }}</div>
                            <div style="margin-right: 10px;">法定第一数量合计：{{ 4000 }}</div>
                            <div style="margin-right: 10px;">法定第二数量合计：{{ 4000 }}</div>
                        </div>
                    </el-tab-pane>
                </el-tabs>
            </div>
        </el-collapse-transition>
    </div>
</template>
<script setup>
import { reactive, inject } from 'vue'
const infoState = inject('state')
console.log('当前状态', infoState)
const state = reactive({
    hearderHidden1: true,
    hearderHidden2: true,
    hearderHidden3: true,
    commodityList: [
        {
            'recordSerial': "108601079613006560",
            'productID': "136614517",
            'classificationMark': "108601079613006560",
            'productName': "花园泵配件一批",
            'productEngName': "A batch of garden pump accessories",
            'commercialSpecification': "Q330B196M",
            'version': "11096493",
            'originRegion': "陕西省汉中市宁强县",
            'productionUnit': "府前西街1号鑫海韵通百货二层",
        },
        {
            'recordSerial': "108601079613006560",
            'productID': "136614517",
            'classificationMark': "108601079613006560",
            'productName': "花园泵配件一批",
            'productEngName': "A batch of garden pump accessories",
            'commercialSpecification': "Q330B196M",
            'version': "11096493",
            'originRegion': "陕西省汉中市宁强县",
            'productionUnit': "府前西街1号鑫海韵通百货二层",
        },
        {
            'recordSerial': "108601079613006560",
            'productID': "136614517",
            'classificationMark': "108601079613006560",
            'productName': "花园泵配件一批",
            'productEngName': "A batch of garden pump accessories",
            'commercialSpecification': "Q330B196M",
            'version': "11096493",
            'originRegion': "陕西省汉中市宁强县",
            'productionUnit': "府前西街1号鑫海韵通百货二层",
        },
        {
            'recordSerial': "108601079613006560",
            'productID': "136614517",
            'classificationMark': "108601079613006560",
            'productName': "花园泵配件一批",
            'productEngName': "A batch of garden pump accessories",
            'commercialSpecification': "Q330B196M",
            'version': "11096493",
            'originRegion': "陕西省汉中市宁强县",
            'productionUnit': "府前西街1号鑫海韵通百货二层",
        },
    ],
    containerInfo: [
        {
            boxPile: '108601079613006560',
            deadLoad: '40.2562',
            LCLMarking: '是',
            ContainerWeight: '47.2562',
            ItemNumber: 'Q330B196M',
        },
        {
            boxPile: '180823164681731070',
            deadLoad: '24.2224',
            LCLMarking: '否',
            ContainerWeight: '47.2562',
            ItemNumber: 'Q330B196M',
        },
        {
            boxPile: '185884273201005440',
            deadLoad: '10.2257',
            LCLMarking: '否',
            ContainerWeight: '47.2562',
            ItemNumber: 'Q330B196M',
        },
        {
            boxPile: '115061273599688800',
            deadLoad: '32.4866',
            LCLMarking: '否',
            ContainerWeight: '47.2562',
            ItemNumber: 'Q330B196M',
        },
    ],
    receipts: [
        {
            code: 'U',
            number: '200221548964',
            name: '发票.excel',
        },
        {
            code: 'Y',
            number: '200221548964',
            name: '发票.excel',
        },
    ]

})
</script>
<style lang="scss" scoped>
.hearder {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 24px;
    background-color: #F5F8F7;
    padding: 2px 8px;

    .le {
        font-family: PingFang SC;
        font-weight: regular;
        font-size: 12px;
        line-height: 20px;
        text-align: left;
    }

    .ri {
        color: #3B78FF;
        font-family: PingFang SC;
        font-weight: regular;
        font-size: 12px;
        line-height: 20px;
        letter-spacing: 0px;
        cursor: pointer;
    }
}

.form-container {
    border: 1px solid #e8e8e8;
    padding: 6px 6px 6px 8px;
    background-color: #ffffff;

    :deep(.el-form-item--small .el-form-item__label) {
        font-size: 12px;
        color: rgba(0, 0, 0, 0.85);
    }

    :deep(.el-input--suffix .el-input__inner) {
        padding-right: 4px;
    }

    :deep(.el-form--inline .el-form-item) {
        display: flex;
        margin-right: 0;
    }

    :deep(.el-form-item--small.el-form-item) {
        margin-bottom: 8px;
    }
}
</style>